import Info from '@icon-park/react/lib/icons/Info'
import { UnwrapOneLevelOfArray } from '@tanstack/react-form'

interface Props {
    errors: UnwrapOneLevelOfArray[]
}
export const ValidateError = ({ errors }: Props) => {
    if (errors.length === 0) return null
    console.log(errors)

    return (
        <div className='flex items-center gap-1 bg-gray-900 text-white px-2 rounded-[5px] mt-2 text-xs  '>
            <Info />{errors.map((err: UnwrapOneLevelOfArray) => err.message).join('，')}
        </div>
    )
}
